<template>
<div class="parent">
  我是父元素
  <div class="son">
    我是子元素
    <div class="sun">
      我是孙元素
    </div>
  </div>
</div>
</template>

<script>
  export default {
    name: 'emTest'
  }
</script>

<style scoped>
  .parent {
    font-size: 3rem;/* 36px */
    width: 50rem; /* 600px */
    height: 50rem; /* 600px */
    border: solid 1px blue;
  }
  .son {
    font-size: 2rem; /* 24px */
    width: 30rem; /* 360px */
    height: 30rem; /* 360px */
    border: solid 1px crimson;
  }
  .sun {
    font-size: 1rem;/*12px*/
    width: 20rem;
    height: 20rem;
    background-color: salmon;
  }
</style>
